<template>
  <div class="home-view">
    <header>
      <van-tabs v-model="active" sticky animated line-width="25px" line-height="5px">
        <van-tab disabled></van-tab>
        <van-tab disabled></van-tab>
        <van-tab disabled></van-tab>
        <van-tab title="发现">
          <found-view></found-view>
        </van-tab>
        <van-tab title="粮仓">
          <Granary-View />
        </van-tab>
        <van-tab disabled></van-tab>
        <van-tab disabled></van-tab>
        <van-tab disabled></van-tab>
      </van-tabs>
    </header>

    <main>
      <!-- <keep-alive> -->
      <router-view></router-view>
      <!-- </keep-alive> -->
    </main>
  </div>
</template>

<script>
import FoundView from "@/components/HomeComponents/FoundComponents/FoundView.vue";
import GranaryView from "@/components/HomeComponents/GranaryComponents/GranaryView.vue";
export default {
  name: "HomeView", //主页
  components: { FoundView, GranaryView },
  data() {
    return {
      active: 0
    };
  },
  methods: {},
  // 监听部分
  watch: {
    // 实现跳转回页面数据刷新
    $route: function(newVal) {
      if (newVal.path == "home") {
        console.log(1);
        this.$$route.go(0);
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.home-view {
  width: 100vw;
  height: 100vh;
  // position: fixed;bug
  top: 0;
  left: 0;
  z-index: 8;

  header {
    width: 100vw;
  }

  ::v-deep .van-swipe {
    width: 95vw;
    min-height: 0px;
    max-height: 114px;
    margin: 0 auto;
    border-radius: 10px;
  }
}
</style>